//举报中心

import React, { useState, useEffect } from 'react';
import moment from 'moment';
import {
  get_jubaozhongxin_list,
  delete_jubaozhongxin_list,
} from '../../utils/api';
import Toptitle from '../../Compon/Toptitle';
import Tbale from '../ContentManagement/content_components/Tbale';
import UploadFile from '../../Compon/UploadFile';
import Gooutfile from '../../Compon/file/Gooutfile.jsx';
import { Button, message ,Tag} from 'antd';
export default function ReportingCenter() {
  const [list, setList] = useState([]);
  const a = async () => {
    const res = await get_jubaozhongxin_list();
    setList(res.data.data);
  };
  useEffect(() => {
    a();
  }, []);
  const columns = [
    {
      title: '序号',
      dataIndex: 'index',
      key: 'index',
      render: (text, record, index) => {
        return index + 1;
      },
    },
    {
      title: 'UserID',
      dataIndex: '_id',
      key: '_id',
    },
    {
      title: '用户名',
      dataIndex: 'jubaozhngxin_name',
      key: 'jubaozhngxin_name',
    },
    {
      title: '举报手机号',
      dataIndex: 'jubaozhngxin_phone',
      key: 'jubaozhngxin_phone',
    },
    {
      title: '工单类型',
      dataIndex: 'jubaozhongxin_gongdanleixing',
      key: 'jubaozhongxin_gongdanleixing',
    },
    {
      title: '举报类型',
      dataIndex: 'jubaozhongxin_gongdanleixing',
      key: 'jubaozhongxin_gongdanleixing',
    },
    {
      title: '内容',
      dataIndex: 'jubaozhngxin_content',
      key: 'jubaozhngxin_content',
    },
    {
      title: '图片',
      dataIndex: 'jubaozhongxin_src',
      key: 'jubaozhongxin_src',
      render: (text, record) => (
        <img
          src={record.jubaozhongxin_src}
          alt=""
          style={{ width: '0.5rem' }}
        />
      ),
    },
    {
      title: '举报时间',
      dataIndex: 'jubaozhngxin_time',
      key: 'jubaozhngxin_time',
      render: (text, record) => {
        return moment(record.jubaozhngxin_time).format('YYYY-MM-DD HH:mm:ss');
      },
    },
    {
      title: '处理状态',
      dataIndex: 'jubaozhngxin_state',
      key: 'jubaozhngxin_state',
      render: (text, record) => {
        return (
          <Tag color={text == 1 ? 'green' : 'red'}>
            {text == 1 ? '已处理' : '未处理'}
          </Tag>
        );
      },
    },
    {
      title: '对接客服',
      dataIndex: 'jubaozhongxin_duijiekefu',
      key: 'jubaozhongxin_duijiekefu',
    },
    {
      title: '操作',
      dataIndex: '_id',
      key: '_id',
      render: (text, record) => {
        return (
          <div>
            <Button type="primary" danger onClick={async () => {
              if (confirm('确定删除吗')) {
                await delete_jubaozhongxin_list({ text: record._id });
                message.success('删除成功');
                a();
              } else {
                message.error('取消删除');
              }
             
            }}>删除</Button>
          </div>
        );
      },
    }
  ];
  return (
    <div>
      <Toptitle title="举报中心"></Toptitle>
      <Tbale data={list} colums={columns}></Tbale>
      <div style={{ display: 'flex' }}>
        <UploadFile
          name={'导入'}
          // url="http://localhost:3000/CustomerService/index/uploadFile"
        ></UploadFile>

        <Gooutfile data={list}></Gooutfile>
      </div>
    </div>
  );
}
